<template>
    <div>
        <el-dialog title="部门信息" style="background: #F0F0F0;" :visible.sync="value" :show-close="false" center>
            <el-form ref="form" :model="data" status-icon>
                <el-form-item prop="name" label="部门名称" :rules="[{required:true,message:'请填写部门名称',trigger:'blur'}]">
                    <el-input style="width: 220px" v-model="data.name" :maxlength="5" show-word-limit></el-input>
                </el-form-item>
            </el-form>
            <template slot="footer">
                <el-button type="success" icon="el-icon-plus" @click="handleSubmit" v-loading.fullscreen.lock="fullscreenLoading">提交</el-button>
            </template>
        </el-dialog>
    </div>
</template>

<script>

    import { saveOrUpdate } from "@/api/access/department";

    export default {
        name: "department-child",
        data(){
            return {
                value : false,
                fullscreenLoading:false,
                data:{}
            }
        },
        methods:{
            handleSubmit(){
                this.$refs['form'].validate(valid=>{
                    if(valid){
                        this.fullscreenLoading = true;
                        saveOrUpdate(this.data).then(res=>{
                            this.$message({
                                type:res.data.success?'success':'error',
                                message:res.data.message,
                                center:true
                            });
                            this.value = false;
                            this.fullscreenLoading = false;
                            this.$parent.getDepartmentList();
                            this.$parent.getUserList({departmentIds:""});
                        })
                    }else{
                        return false;
                    }
                });
            }
        }
    }
</script>

<style scoped>

</style>